@import "../config.less";

@cls: @{perfix}-select;

.@{cls} {
    position: relative;
}

.@{cls}-view {
    cursor: pointer;
    > i {
        transition: all 0.2s ease-out;
        position: absolute;
        right: 10px;
        z-index: 2;
    }

    .@{cls}-iup {
        transform: rotate(-180deg);
        transition: all 0.2s ease-out;
    }
}

.@{cls}-drop {
    box-shadow: 2px 2px 10px rgba(0, 0, 0, .1);
    margin-top: 1px;
    position: absolute;
    left: -1px;
    right: -1px;
    overflow-y: auto;

    > div {
        cursor: pointer;
    }
}

.@{cls}-drop-hide {
    transform: scaleY(0);
    transition: transform 0.2s ease-out;
    transform-origin: top;
}

.@{cls}-drop-show {
    transform: scaleY(1);
    transition: transform 0.2s ease-out;
    transform-origin: top;
}

.@{cls}-input {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    outline: none;
    border: none;
}

.@{cls}-input-hide {
    opacity: 0;
}